<main baThemeRun>
    <div class="row">
        <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
            <jhi-pie-chart></jhi-pie-chart>
        </div>
    </div>
    <div class="row">
        <ba-card class="col-xlg-6 col-xl-6 col-lg-12 col-sm-12 col-12" title="dashboard.acquisitionChannels" baCardClass="traffic-panel medium-card">
            <jhi-traffic-chart></jhi-traffic-chart>
        </ba-card>

        <ba-card class="col-xlg-6 col-xl-6 col-lg-12 col-sm-12 col-12" title="dashboard.usersByCountry" baCardClass="medium-card">
            <jhi-users-map></jhi-users-map>
        </ba-card>
    </div>

    <div class="row">
        <div class="col-xlg-9 col-xl-6 col-lg-6  col-md-12 col-sm-12 col-12">
            <div class="row">
                <ba-card class="col-xlg-8 col-xl-12 col-lg-12 col-md-7 col-sm-12 col-12" title="dashboard.revenue" baCardClass="medium-card">
                    <jhi-line-chart></jhi-line-chart>
                </ba-card>
                <ba-card class="col-xlg-4 col-xl-12 col-lg-12 col-md-5 col-sm-12 col-12" baCardClass="popular-app medium-card">
                    <jhi-popular-app></jhi-popular-app>
                </ba-card>
            </div>
        </div>

        <div class="col-xlg-3 col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12">
            <ba-card title="dashboard.feed" baCardClass="large-card with-scroll feed-panel">
                <jhi-feed></jhi-feed>
            </ba-card>
        </div>

    </div>

    <div class="row shift-up">
        <ba-card class="col-xlg-3 col-lg-6 col-md-12 col-sm-12 col-12" title="dashboard.todoList" baCardClass="xmedium-card feed-comply-panel with-scroll todo-panel">
            <jhi-todo></jhi-todo>
        </ba-card>
        <ba-card class="col-xlg-6 col-lg-6 col-md-12 col-sm-12 col-12" title="dashboard.calendar" baCardClass="xmedium-card feed-comply-panel with-scroll calendar-panel">
            <jhi-calendar></jhi-calendar>
        </ba-card>
    </div>
</main>
